// 获取按钮
const btns:Element[] | null = [...document.querySelectorAll('button')]

// 背景颜色的枚举
enum Color {
    'green',
    "yellow",
    "skyblue",
    "red"
}

// 添加点击事件
btns.forEach((item, idx) => {
    item.addEventListener('click', (e:any) => {
        //  创建弹框
        const dialogDom = document.createElement('div')

        const text:any = item.getAttribute('text');

        (dialogDom.innerHTML as string) = text

        // 给创建的元素添加类名
        dialogDom.className = 'dialogBox'

        dialogDom.style.background = Color[idx]

        document.body.appendChild(dialogDom)

        setTimeout(() => {
            const dom: Element | null = document.querySelector('.dialogBox');

            dom?.remove()
        }, 3000)

    })
})